﻿<div class="k-block divToolbar" style="margin: 5px">
    <div style="display: inline-block;">
        <select id="selArchive" style="width: 400px"></select>
    </div>
    <a class="k-button" onclick="Export()"><span class="k-icon k-i-calendar"></span><span>导出结果</span></a>
    <form id="exportForm" method="post" action="/Analyses/ANS/@(ViewBag.History?"ExportPS4Grade":"ExportRS4Grade")" target="_blank" style="display: none">
        <input type="hidden" name="aGuid" id="df_ArchiveGuid" />
        <input type="hidden" name="sGuid" value="@PH.Web.Global.WebContext.CurrentSchool.Guid" />
    </form>
</div>
<div id="tbs_S4Grade" style="margin: 5px">
    <ul>
        <li class="k-state-active">数字表</li>
        <li>饼状图</li>
        <li>柱状图</li>
    </ul>
    <div>
        <div id="grid_S4Grade" style="text-align: center;"></div>
    </div>
    <div>
        <div id="chart_circles"></div>
    </div>
    <div>
        <div id="chart_bar_Excellent"></div>
        <div id="chart_bar_Good"></div>
        <div id="chart_bar_Pass"></div>
        <div id="chart_bar_Fail"></div>
        <div id="chart_bar_Qualified"></div>
        <div id="chart_bar_Average"></div>
    </div>
</div>

<script class="init">
    var his = "@(ViewBag.History)" == "True";
    if (his)
        LocatedMenu("历年报告", "年级报告");
    else
        LocatedMenu("数据分析", "年级分析");

    $("#selArchive").kendoDropDownList({
        dataTextField: "Title",
        dataValueField: "Guid",
        dataSource: Whale.dataSource({
            url: "/Achievements/Archive/Gets",
            getParameters: function () {
                return {
                    aType: 2,
                    expired: his
                }
            }
        }),
        dataBound: function (e) {
            if (this.dataSource.data().length == 0) {
                this.setDataSource(new kendo.data.DataSource({
                    data: [{ Title: "暂无档案", Guid: "" }]
                }));
            }
        },
        change: function (e) {
            //Load();
        }
    });
    $("#tbs_S4Grade").kendoTabStrip();

    var sGuid = "@PH.Web.Global.WebContext.CurrentSchool.Guid";
    var s4grade = Whale.Remote.GetEntity({
        url: "/Analyses/ANS/GetS4Grade",
        parameters: {
            aGuid: $("#selArchive").data("kendoDropDownList").value(),
            sGuid: sGuid,
            history:his
        }
    });
</script>

<script class="grid">
    $("#grid_S4Grade").kendoGrid({
        columns: [{
            title: "年级",
            field: "GradeName",
            width: 150
        }, {
            title: "样本数",
            field: "Samples",
            width: 65
        }, {
            title: "优秀数",
            field: "Excellent",
            width: 65
        }, {
            title: "优秀率",
            field: "ExcellentRate",
            format: "{0:p2}",
            width: 70
        }, {
            title: "良好数",
            field: "Good",
            width: 65
        }, {
            title: "良好率",
            field: "GoodRate",
            format: "{0:p2}",
            width: 70
        }, {
            title: "及格数",
            field: "Pass",
            width: 65
        }, {
            title: "及格率",
            field: "PassRate",
            format: "{0:p2}",
            width: 70
        }, {
            title: "不及格数",
            field: "Fail",
            width: 80
        }, {
            title: "不及格率",
            field: "FailRate",
            format: "{0:p2}",
            width: 80
        }, {
            title: "合格数",
            field: "Qualified",
            width: 65
        }, {
            title: "合格率",
            field: "QualifiedRate",
            format: "{0:p2}",
            width: 75
        }, {
            title: "平均分",
            field: "Average",
            format: "{0:d}",
            width: 65
        }, {}],
        dataSource: s4grade,
        dataBound: function (e) {
            //让表头居中
            $("th.k-header").attr("style", "text-align:center; font-weight:bold;");
        }
    });
</script>

<script class="circle">
    $.each(s4grade, function (i, o) {
        var obj = "<div id='char_circle_" + i + "' style='display:inline-block;'></div>";
        $(obj).appendTo("#chart_circles").kendoChart({
            title: {
                position: "top",
                text: o.GradeName
            },
            legend: {
                visible: false
            },
            seriesDefaults: {
                labels: {
                    visible: true,
                    background: "transparent",
                    template: "#= category #: \n #= kendo.format('{0:0.00}',value)#%",
                }
            },
            series: [{
                type: "pie",
                data: [{
                    category: "优秀率",
                    value: o.ExcellentRate * 100,
                    color: "#76c6d2"
                }, {
                    category: "良好率",
                    value: o.GoodRate * 100,
                    color: "#a1bd70"
                }, {
                    category: "及格率",
                    value: o.PassRate * 100,
                    color: "#f58d76"
                }, {
                    category: "不及格率",
                    value: o.FailRate * 100,
                    color: "#ffdd6c"
                }]
            }]
        });
    });
</script>

<script class="bars">
    $("#chart_bar_Excellent").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Excellent",
            name: "优秀",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        },
    });
    $("#chart_bar_Good").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Good",
            name: "良好",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        }
    });
    $("#chart_bar_Pass").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Pass",
            name: "及格",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        }
    });
    $("#chart_bar_Fail").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Fail",
            name: "不及格",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        }
    });
    $("#chart_bar_Qualified").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Qualified",
            name: "合格",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        }
    });
    $("#chart_bar_Average").kendoChart({
        dataSource: s4grade,
        legend: {
            position: "top"
        },
        seriesDefaults: {
            type: "column"
        },
        series: [{
            field: "Average",
            name: "平均分",
            color: "#76c6d2"
        }],
        categoryAxis: {
            field: "GradeName",
            labels: {
                //rotation: -45
            },
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "N0"
        }
    });
</script>

<script class="export">
    function Export() {
        $("#df_ArchiveGuid").val($("#selArchive").data("kendoDropDownList").value());
        $("#exportForm").submit();
    }
</script>
